<template>
  <div class="world">
    <div class="top">
         上下两栏布局
    </div>
    <div class="bottom">
      上下两栏布局
    </div>
  </div>
</template>

<script>
//  import sideBar from '../components/side-bar';

export default {
  name: 'World',
  data () {
    return {
      msg: '配置路由'
    }
  }
  // components:{sideBar}
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss">

  .world{
    height: 100%;
     width:100%;
     .top{
       width:100%;
       height:50%;
       background: sandybrown;
       text-align: center;
     }
    .bottom{
       width:100%;
       height:50%;
       background:wheat;
       text-align: center;
     }
  }
</style>
